<template>
  <div class="m-alert" v-text="text" :class="type"></div>
</template>

<script>
  export default {
    props: {
      text: {
        type: String,
        default: ''
      },
      type: {
        type: String,
        default: 'success'
      }
    }
  }
</script>

<style lang="scss" scoped>
  .m-alert {
    margin: 15px 0;
    padding: 15px 0;
    border-radius: 4px;
    text-indent: 20px;
    font-size: 14px;
    &.success {
      color: #3c763d;
      background: #dff0d8;
    }
    &.warn {
      color: #8a6d3b;
      background: #fcf8e3;
    }
    &.danger {
      color: #a94442;
      background: #f2dede;
    }
  }
</style>
